<template>
  <el-radio-group v-model="radio" :disabled="disabled" v-bind="$attrs">
    <el-radio
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value"
      >{{ item.label }}</el-radio
    >
  </el-radio-group>
</template>

<script setup>
import { ref, watch } from "vue";

const props = defineProps({
  modelValue: [Number, String],
  options: Array,
  disabled: {
    type: Boolean,
    default: false,
  },
});

const emit = defineEmits(["update:modelValue"]);

const radio = ref(props.modelValue || "");

watch(radio, (newVal) => {
  if (newVal != props.modelValue) {
    emit("update:modelValue", newVal);
  }
});

</script>
